<template>
  <div id="singleMeets">
    <el-card shadow="always" class="box-card" v-loading="loading">
      <el-form :inline="true" :model="queryForm" label-width="100px" class="demo-form-inline" >
        <el-form-item label="所属项目">
          <el-select v-model="queryForm.projectId" >
            <el-option v-for="item in projectList"
                       :key="item.id"  :label="item.projectName"
                       :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="会议主题">
          <el-input v-model="queryForm.orderName" placeholder="会议主题关键字查找"></el-input>
        </el-form-item>
        <el-form-item label="会议时间">
          <el-date-picker
              v-model="queryForm.projectTimeRange"
              type="daterange"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期">
          </el-date-picker>
        </el-form-item>

<!--        <el-form-item label="状态">-->
<!--          <el-select v-model="queryForm.status" >-->
<!--            <el-option v-for="item in statusList"-->
<!--                       :key="item.value"  :label="item.label"-->
<!--                       :value="item.value">-->
<!--            </el-option>-->
<!--          </el-select>-->
<!--        </el-form-item>-->
        <el-form-item>
          <el-button type="primary" @click="onSearch">查询</el-button>
          <el-button  type="info"  @click="reSet" icon="el-icon-search">重置</el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 项目列表 -->
    <el-card shadow="always" class="table-card">
      <el-table :data="dataList" border style="width: 100%"  >
        <el-table-column align="center"   prop="id"   label="编号" width="80">
        </el-table-column>
        <el-table-column align="center" prop="orderName" label="名称">
        </el-table-column>
        <el-table-column align="center" prop="applyMoney" label="收款金额(元)">
        </el-table-column>
        <el-table-column align="center" prop="createTime" label="发起时间"  width="180">
        </el-table-column>
        <el-table-column align="center" prop="type" label="类型" :formatter="formatType">
        </el-table-column>
        <el-table-column  prop="projectName" align="center" label="所属项目">
        </el-table-column>

        <el-table-column  prop="meetingName" align="center" label="所属会议">
        </el-table-column>
        <el-table-column align="center" prop="projectStatus" label="状态" width="100"  :formatter="formatStatus">
          <template v-slot:default="scope">
            <el-tooltip  effect="dark" trigger="hover" placement="right-start" :content="scope.row.errorMessage">
              <el-icon class="el-icon-warning-outline">  <span>{{ scope.row.errorMessage }}</span></el-icon>
            </el-tooltip>

          </template>
        </el-table-column>

        <el-table-column label="操作" width="100" align="center">
          <template slot-scope="scope">
            <el-button size="mini" type="text" @click="toDetails(scope.row)">{{scope.row.stauts=='OFFICIAL_EXAMINE'?'审核':'查看'}}</el-button>
          </template>
        </el-table-column>
      </el-table>


      <div class="pagination" style="margin-top: 10px">
        <TablePaging :currentPage="queryForm.current" :total="queryForm.total" :pageSize="queryForm.size"
                     @pageChange="handleCurrentChange"/>
      </div>
    </el-card>
  </div>
</template>

<script>
import {getAssistantInfo, getSpendingOrderListByPage} from '@/request/api.js';
import TablePaging from '@/components/TablePaging.vue';

export default {
  name: 'index',
  components: {TablePaging},
  data() {
    return {
      queryForm:{
        current:1,
        size:10,
        total:0,
        status:'ALL',
        orderName:"",
        projectTimeRange:[]
        // projectType: 'single'
      },
      dataList:[],
      statusList:[
        {
          label: '全部',
          value: 'ALL'
        },
        {
          label: '待提交',
          value: 'WAIT'
        },
        {
          label: '审核中',
          value: 'SUBMIT'
        },
        {
          label: '被驳回',
          value: 'ERROR'
        },
        {
          label: '已完成',
          value: 'FINISH'
        },
      ],

      loading: false,
      projectList: [],
    }
  },

  mounted() {
    this.loadData();
  },
  methods: {

    toDetails(item){
      //供应商结算
        this.$router.push({
          name: 'supplierSettlementAudit',
          query: {
            orderId: item.id,
            pId:item.projectId,
            mId:item.meetingId,
            collectWay:item.collectWay,
            feeType:item.feeType,
          }
        })


      // if(item.type=="DOCTOR"){
      //   //劳务结算
      //   this.$router.push({
      //     name: 'uploadFile',
      //     query: {
      //       mId: item.id,
      //       // status: item.meetingStatus,
      //       // now: '4'
      //     }
      //   })
      // }else {
      //   this.supplierSettlement(item)
      // }

    },

    // // 供应商结算
    // supplierSettlement(item) {
    //   this.ckMeetingId = item.id;
    //   this.loading = true;
    //   this.getCollectWayFun(item);
    //
    //   getOrderByMeetId({
    //     meetingId: item.id,
    //   }).then(res => {
    //     this.orderData = res.data;
    //     if (this.orderData) {
    //       this.loading = false;
    //       this.toSupplierSettlement()
    //       console.log('有记录')
    //     } else {
    //       this.loading = false;
    //       this.settleAccountsShow = true;
    //       console.log('无记录')
    //     }
    //   })
    // },


    onSearch(){
      this.queryForm.current = 1;
      this.loadData()
    },


    formatStatus(row, column, cellValue) {
      const statusMap = {
        'CREATED': '本地保存',
        'AI_REVIEW': '预审中',
        'AI_REVIEW_SUCCESS': '预审成功',
        'WAIT': '待提交',
        'SUBMIT': '已提交',
        'SUCCESS': '审核成功',
        'FINISH': '已完成',
        'ERROR': '被驳回',
        'OFFICIAL_EXAMINE': '待审核'
      };
      return statusMap[cellValue] || '未知状态';
    },

    formatType(row, column, cellValue){
      const statusMap = {
        'DOCTOR': '劳务发放',
        'OTHER': '项目回款'
      };
      return statusMap[cellValue] || '未知状态';
    },

    reSet(){
      this.queryForm={
        current:1,
        size:10,
        total:0,
        projectStatus:"ALL"
      }
      this.loadData()
    },
    handleSizeChange(val) {
      this.queryForm.size = val;
      this.loadData()
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.queryForm.current = val;
      this.loadData()
      console.log(`当前页: ${val}`);
    },
    tableRowClassName({row, rowIndex}) {
      console.log(row.projectStatus)
      if (row.projectStatus === 'UNDERWAY') { //进行中
        return 'warning-row';
      } else if (row.projectStatus === 'TIMEOUT') {//已结束
        return 'end-row';
      }else if (row.projectStatus === 'WAIT_CLAIM') { //待认领
        return 'warning-row';
      }
      return '';
    },



    // 获取table数据列表
    loadData() {
      const params = {...this.queryForm};
      if (params.status === 'ALL') {
        delete params.projectStatus;
      }
      getSpendingOrderListByPage(params).then(res => {
        if (res.code == 200) {
          this.dataList = res.data.records;
          this.queryForm.total = res.data.total
        }
      })
    },

    // 查看会议详情
    //判断是单场会还是系列会，同时判断是官员还是助教
    toMeetingDetails(item) {
      let token = JSON.parse(localStorage.getItem('token'));
      if(item.projectType=='series'){

        if(token.type == 'OFFICIAL'){
          // this.handleSelect('offocoalProject')
          this.toOfficialMeetList(item)
        }else if(token.type == 'ASSISTANT'){
          // this.handleSelect('project')
          this.toMeetList(item)
        }



      }else if(item.projectType=='single'){
        if(token.type == 'OFFICIAL'){
          this.handleSelect('officialSingleMeets')
        }else if(token.type == 'ASSISTANT'){
          this.handleSelect('singleMeets')
        }
      }
    },


    // 查看系列会会议详情
    toMeetList(item) {
      localStorage.setItem('projectDetails', JSON.stringify(item))
      this.$router.push({
        name: 'meetinglist',
        query: {
          pId: item.id
        }
      })
    },


    // 查看会议详情
    toOfficialMeetList(item) {
      localStorage.setItem('projectDetails', JSON.stringify(item))
      this.$router.push({
        name: 'officialMeetinglist',
        query: {
          pId: item.id
        }
      })
    },


    //单场会
    handleSelect(key) {
      let token = JSON.parse(localStorage.getItem('token'));
      if (token.type == 'ASSISTANT') {
        localStorage.removeItem('regToken')
      }
      this.$router.push({
        name: key
      })
    },
  }
}
</script>

<style lang="scss" >

.el-table .warning-row {
  background: oldlace;
}
//.el-table .end-row{
//  background: #d3d4d6;
//}
.el-table .success-row {
  background: #f0f9eb;
}

#singleMeets {
  display: flex;
  height: auto;
  flex-direction: column;

  .box-card {
    margin: 20px 20px 0;
    padding: 20px 20px 0;
    border-radius: 10px;
  }
  .table-card {
    margin: 20px 20px 0;
    //padding: 20px 20px 0;
    border-radius: 10px;
  }

}


</style>